<template>
  <div class="stu-homework">
    <div>
      <span class="titleSty">已发布作业</span>
    </div>
    <div class="homeworkList">
      <el-table
          :data="tableData.filter(data => !search || data.title.toLowerCase().includes(search.toLowerCase()))"
          style="width: 100%;"
          height="11rem"
          :cell-style="cellStyle"
          @row-click = "onRowClick">
          <el-table-column
          label="日期"
          sortable
          prop="update_date">
          </el-table-column>
          <el-table-column
          label="科目"
          sortable
          prop="subject_name">
          </el-table-column>
          <el-table-column
          label="标题"
          prop="title">
          </el-table-column>
          <el-table-column
          label="截至日期"
          prop="deadline">
          </el-table-column>
          <el-table-column
          align="center"
					prop="resTime">
          <template slot="header" slot-scope="scope">
              <el-input
              v-model="search"
              size="mini"
              placeholder="输入标题搜索"/>
          </template>
          </el-table-column>
      </el-table>
    </div>
  </div>
</template>

<script>
import http from '../../../util/http';

  export default {
    data() {
      return {
        tableData: [],
        search: '',
      };
    },
    methods: {
      getHomeworkList() {
        http.get(`/homeworkAPI/findHomework?id=${window.localStorage.getItem('userId')}`)
        .then((res) => {
          // console.log(res.resultMap.findHomework.length);
          this.tableData = res.resultMap.findHomework;
          this.listLength = res.resultMap.findHomework.length;
          const today = new Date();
          const a1 = today;
          for (let i = 0; i < this.listLength; i += 1) {
            const a2 = Date.parse(new Date(this.tableData[i].update_date));
            const b = parseInt((a1 - a2) / (1000 * 60 * 60 * 24), 10);
            // console.log(b);
            if (b <= 3 && b >= 0) {
              this.tableData[i].resTime = 'New';
              // console.log(this.tableData[i].resTime);
            }
          }
        })
        .catch((error) => {
          // console.log(error);
        });
      },
      onRowClick(row, event, column) {
        window.localStorage.setItem('homeworkID', row.id);
        this.$router.push('/ViewHomework');
      },
      cellStyle({ columnIndex }) {
        if (columnIndex === 4) {
          return `font-size:.4rem;
                font-style: oblique;
                color: transparent;
                -webkit-text-stroke: .02rem red;
                letter-spacing: 0.04em;`;
        }
        return '';
      },
    },
    mounted() {
      this.getHomeworkList();
    },
		created() {
			// this.computerTime();
			// for (let i = 0; i < this.tableData.length; i += 1) {
			// 	const a1 = Date.parse(new Date(this.tableData[i].dealine));
			// 	const a2 = Date.parse(new Date(this.tableData[i].date));
			// 	const b = parseInt((a1 - a2) / (1000 * 60 * 60 * 24), 10);
			// 	console.log(b);
			// 	if (b < 2) {
			// 		return 'warning-row';
			// 		// this.tableData[i].resTime = '快截止了';
			// 	}
			// }
		},
    // computed: {
		// 	computeTime() {
		// 		console.log(this.tableData[1]);
		// 		return (this.tableData[1]);
		// 	},
    // },
	};
</script>
<style scoped>
.stu-homework{
  width: 19rem;
}
.titleSty{
  color: white;
  font-size: .7rem;
  margin: 0 0 0 .5rem;
}
.homeworkList{
  box-shadow:.1rem .06rem .15rem #888;
  margin-top: .5rem;
}
</style>
